<template>
	<el-main class="bg table_wrap cart">
	  <!-- 头部检索 -->
	  <div class="div-form">
		<el-form
		  ref="elFormRef"
		  :model="formInline"
		  label-width="90px"
		  :style="{ width: '100%' }"
		  label-position="left"
		>
		  <el-row :gutter="20" class="rows row1">
			<el-col :xs="24" :sm="24" :lg="8" class="el_form_search_wrap">
					<el-form-item label="标题">
						<el-input v-model="formInline.title"></el-input>
					</el-form-item>
				</el-col>
				<el-col :xs="24" :sm="24" :lg="8" class="el_form_search_wrap">
					<el-form-item label="关键词">
						<el-input v-model="formInline.keywords"></el-input>
					</el-form-item>
				</el-col>
		  </el-row>
		</el-form>
	  </div>
	  <baseTable
		:tableColumns="columns"
		:requestApi="url_get_list"
		:isShowSelect="true"
		:vm="vm" 
		v-model:isRefresh="isRefresh"
		:otherParams="formInline"
		@handleSelectionChange="handleSelectionChange"
		@handleCurrentChangeNew="handleCurrentChangeNew"
	  >
		<!-- 头部按钮 -->
		<template #baseHeadFunt>
		  <el-button type="primary" @click="onSubmit">查询</el-button>
		  <el-button @click="onReset(true)">重置</el-button>
		  <el-button
			type="danger"
			v-if="user_group == '管理员' || $check_action('/cart/table', 'del')"
			class="search_btn_del"
			@click="delInfo()"
			>删除</el-button
		  >
		  <el-button
			v-if="user_group == '管理员' || $check_action('/cart/view')"
			class="float-right search_btn_add"
			@click="router.push('./view?')"
			>添加</el-button
		  >
		</template>
		<!-- 操作 -->
		<template #baseTableFunt="{ scope }">
		  <el-button
			type="primary"
			size="small"
			@click="router.push('./view?' + field + '=' + scope.row[field])"
			>编辑</el-button
		  >
		</template>
		<template #baseTableFunt2="{ scope }">
		  <el-button
			type="primary"
			size="small"
			@click="router.push('./view?' + field + '=' + scope[field])"
			>编辑</el-button
		  >
		</template>
		<!-- 特殊表格内容 -->
		<template #tableContent="{ scope, column }">
		<el-image :preview-teleported="true"  v-if="column.prop === 'img'" style="width: 100px; height: 100px" :src="$fullUrl($banseUrl,scope.row.img)" :preview-src-list="[$fullUrl($banseUrl,scope.row.img)]">
		</el-image>
		<span v-if="column.prop === 'state'">
			{{getObj(list_state,scope.row.state).name}}
		  </span>
		  <span v-if="column.prop === 'create_time'">{{
			formatDate(scope.row.create_time)
		  }}</span>
		  <span v-if="column.prop === 'update_time'">{{
			formatDate(scope.row.update_time)
		  }}</span>
		</template>
		<template #tableContent2="{ scope, column }">
		<el-image :preview-teleported="true"  v-if="column.prop === 'img'" style="width: 100px; height: 100px" :src="$fullUrl($banseUrl,scope.img)" :preview-src-list="[$fullUrl($banseUrl,scope.img)]">
		</el-image>
		<span v-if="column.prop === 'state'">
			{{ column.label }}：{{getObj(list_state,scope.state).name}}
		  </span>
		  <span v-if="column.prop === 'create_time'">{{ column.label }}：{{
			formatDate(scope.create_time)
		  }}</span>
		  <span v-if="column.prop === 'update_time'">{{ column.label }}：{{
			formatDate(scope.update_time)
		  }}</span>
		</template>
	  </baseTable>
	</el-main>
  </template>
  <script setup>
  import { useRouter } from "vue-router";
  import {
	$fullUrl,
	formatDate,
	$banseUrl,
	$check_action,
  } from "@/utils/utils.js";
  import { $post, $get } from "@/api/Api.js";
  import { ElMessage } from "element-plus";
  import { ref, onMounted } from "vue";
  import storageHelper from "@/libs/StorageHelper";
  let table = ref("cart");
  let field = ref("cart_id");
  let url_get_list = ref("/api/cart/get_list");
  let url_del = ref("/api/cart/del?");
  let user_group = storageHelper.getUserInfo().user_group;
  let router = useRouter();
  // 状态
  let list_state = ref([
					{"name":"使用中","value":1},
					{"name":"已失效","value":0}
				]);
let vm=ref({
  id: "cart_id",
})
  // 列名
  const columns = [
	{ prop: "title", label: "标题" },
	{ prop: "img", label: "封面图" },
	{ prop: "price", label: "单价" },
	{ prop: "price_old", label: "原价" },
	{ prop: "num", label: "数量" },
	{ prop: "price_count", label: "总价" },
	{ prop: "state", label: "状态" },
	{ prop: "create_time", label: "创建时间" },
	{ prop: "update_time", label: "更新时间" },
  ];
  // 刷新table
  let isRefresh = ref(false);
  
  //批量勾选数据
  let selectList = ref([]);

  //点击当前行数据
  let currentRowTableProduct = ref({});
  //表格勾选回调
  let handleSelectionChange = (val) => {
	selectList.value = val.map((item) => {
	  return item.cart_id;
	});
  };
  //点击当前行
  let handleCurrentChangeNew = (val) => {
	currentRowTableProduct.value = val;
  };
  // 批量删除删除
  let delInfo = () => {
	ElMessageBox.confirm("此操作将永久删除该文件, 是否继续?", "提示", {
	  confirmButtonText: "确定",
	  cancelButtonText: "取消",
	  type: "warning",
	})
	  .then(() => {
		selectList.value.map((item) => {
		  delFun(item);
		});
	  })
	  .catch(() => {
		ElMessage({
		  type: "info",
		  message: "取消操作",
		});
	  });
  };
  
  // 调用删除方法
  let delFun = (id) => {
	$get(url_del.value + "cart_id=" + id).then((json) => {
	  if (json.result) {
		ElMessage.success("删除成功");
	  } else if (json.error) {
		ElMessage.error(json.error.cart);
	  }
	  isRefresh.value = true;
	});
  };
// 查询数组对象某个是否包含某个值,返回对应对象
let getObj=(arr,val) =>{
	let obj = arr.find(item => item.value == val)
	return obj;
}

  let table_class = ({ row, column, rowIndex, columnIndex }) => {
	return "table_class";
  };
  // 头部搜索// 搜索
  let formInline = ref({
	title: "",
	keywords: ""
  });
  // 搜索
  let onSubmit = () => {
	isRefresh.value = true;
  };
  
  // 重置
  let onReset = (refresh) => {
	formInline.value = {
		title: "",
	    keywords: ""
	};
	isRefresh.value = refresh;
  };
  // 获取collect
// let get_collect_group = async () => {
//   let json = await $get("/api/collect/get_list");
//   if (json.result) {
//     list_collect.value = json.result.list;
//   } else if (json.error) {
//     console.error(json.error);
//   }
// };
//   onMounted(() => {
//     get_collect_group()
//   });
  </script>
  <style lang="less" scoped>
  .div-form {
	padding: 10px;
  }
  </style>
  